import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Window 2.2
import QtGraphicalEffects 1.0
import QtQuick.Controls.Styles 1.2
import QtQuick.Layouts 1.1
import QtGraphicalEffects 1.0
import Utils 1.0
import "."
import "./components/"
import "../javascript/Utils.js" as UtilsJS

ApplicationWindow {
    id: applicationWindow
    visible: true
    width: 540
    height: 900
    title: qsTr("Preço Líder")

    property FornecedoresPanel fornecedores_panel: null
    property MapaPanel mapa_panel: null
    property string currentPos

    SyncController {
        id: syncController

        onSendComplete: {hideLoading(); body.pop();}
        onSendError: {hideLoading(); body.pop();}
    }

    Component.onCompleted: {
        var componentMapa = Qt.createComponent("qrc:/qml/MapaPanel.qml");
        mapa_panel = componentMapa.createObject(mapa_panel);
        body.push(mapa_panel);
    }

    onClosing: {
        close.accepted = false

        if(!loading.visible) {
            if (body.depth > 1) {
                if(body.currentItem.back()) {
                    body.pop();
                    updateToolBar();
                }
            } else {
                close.accepted = true;
            }
        }
    }

    function updateToolBar() {
        var item = body.currentItem;
        if(item.showMenuButton) {
            menuButton.visible = true;
            menuButton.text = item.titulo;
        } else {
            menuButton.visible = false;
            backButton.text = item.titulo;
        }
        backButton.visible = !menuButton.visible;
    }

    FontLoader {
        id: webFont
        source: "qrc:/fonts/fontawesome-webfont.ttf"
    }

    toolBar: Item {
        width: parent.width
        height: UtilsJS.dp2px(48)

        DropShadow {
            anchors.fill: top_menu
            source: top_menu
            height: UtilsJS.dp2px(3)
            horizontalOffset: 0
            verticalOffset: UtilsJS.dp2px(1)
            radius: UtilsJS.dp2px(3)
            samples: 16
            color: "#20000000"
            transparentBorder: true
        }

        ToolBar {
            id: top_menu
            anchors.fill: parent
            style: ToolBarStyle {
                padding {left: UtilsJS.dp2px(-10); right: 0; top: 0; bottom: 0;}
                background: Rectangle {
                    color: "#d9d9d9"
                }
            }

            ToolButton {
                id: menuButton
                text: "Preço Líder"
                height: parent.height
                width: UtilsJS.dp2px(175)
                anchors.verticalCenter: parent.verticalCenter

                property var subtitulo: "sub titulo"

                style: ButtonStyle {
                    label: Row {
                        spacing: UtilsJS.dp2px(8)
                        Text {
                            text: "" // fa-bars
                            color: "#777777"
                            font.family: webFont.name
                            font.pixelSize: UtilsJS.dp2px(24)
                            height: parent.height
                            width: UtilsJS.dp2px(24)
                            verticalAlignment: Text.AlignVCenter
                            horizontalAlignment: Text.AlignLeft
                        }
                        Text {
                            text: "" // fa-trophy
                            color: "#ffbd21"
                            font.family: webFont.name
                            font.pixelSize: UtilsJS.dp2px(32)
                            height: parent.height
                            verticalAlignment: Text.AlignVCenter
                        }
                        Column {
                            width: UtilsJS.dp2px(300)

                            Text {
                                id: tituloText
                                height: subtituloText.visible?parent.parent.height-subtituloText.height:parent.parent.height
                                color: "#000000"
                                text: control.text
                                font.pixelSize: UtilsJS.dp2px(18)
                                verticalAlignment: Text.AlignVCenter
                            }

                            Text {
                                id: subtituloText
                                visible: false
                                color: "#000000"
                                text: control.subtitulo
                                font.pixelSize: UtilsJS.dp2px(14);
                                verticalAlignment: Text.AlignVCenter
                            }

                        }

                    }
                    background: Rectangle {
                        border.width: 0
                        color: control.pressed ? "#33b5e5" : "transparent"
                    }
                }
            }

            ToolButton {
                id: backButton
                text: ""
                visible: false;
                height: parent.height
                width: UtilsJS.dp2px(175)
                anchors.verticalCenter: parent.verticalCenter
                onClicked: {
                    body.pop();
                    updateToolBar();
                }
                style: ButtonStyle {
                    label: Row {
                        spacing: UtilsJS.dp2px(8)
                        Text {
                            text: ""
                            color: "#777777"
                            font.family: webFont.name
                            font.pixelSize: UtilsJS.dp2px(24)
                            height: parent.height
                            width:  UtilsJS.dp2px(24)
                            verticalAlignment: Text.AlignVCenter
                            horizontalAlignment: Text.AlignRight
                        }
                        Text {
                            text: "" // fa-trophy
                            color: "#ffbd21"
                            font.family: webFont.name
                            font.pixelSize: UtilsJS.dp2px(32)
                            height: parent.height
                            verticalAlignment: Text.AlignVCenter
                        }
                        Text {
                            color: "#000000"
                            text: control.text
                            font.pixelSize: UtilsJS.dp2px(18)
                            height: parent.height
                            verticalAlignment: Text.AlignVCenter
                        }
                    }
                    background: Rectangle {
                        border.width: 0
                        color: control.pressed ? "#33b5e5" : "transparent"
                    }
                }
            }
        }
    }

    StackView {
        id: body
        width: parent.width
        height: parent.height

    }

    function exibeFornecedores() {
        console.log("exibir fornecedores");
        if(fornecedores_panel==null) {
            var componentFornecedores = Qt.createComponent("qrc:/qml/FornecedoresPanel.qml");
            fornecedores_panel = componentFornecedores.createObject(fornecedores_panel);
        }

        var pos = currentPos.split(",");
        fornecedores_panel.updateList(pos[0],pos[1],syncController.loadFornecedores());
        fornecedores_panel.updating = false;
        body.push(fornecedores_panel);
    }

    function setCurrentPos(pos) {
        currentPos = pos;
    }

    function updateFornecedor(id) {
        showLoading();
        var pos = currentPos.split(",");
        syncController.updatePos(id,pos[0],pos[1]);
    }

    Rectangle {
        id: loading
        width: parent.width
        height: 0
        visible: false
        color: "#88000000"

        MouseArea {
            width: parent.width
            height: parent.height
        }
    }

    function showLoading() {
        loading.height = applicationWindow.height;
        loading.visible = true;
    }

    function hideLoading() {
        loading.visible = false;
        loading.height = 0;
    }

}
